<template>
<div class="list">
  <BaseList ref="list"  :option="listOption" @load="loadData" >
    <div  class="item" slot-scope="props" slot="item">{{props.data}}</div>
  </BaseList>
  </div>
</template>

<script>
import BaseList from '@/components/common/Baselist'
export default {
  components:{BaseList},
  data (){
    return {
      pageIndex:0,
      pageSize: 20,
      data:[],
      listOption: {
        needRefresh: true
      }
    }
  },
  methods:{
    loadData(type) {
      console.log(type)
      setTimeout(() => {
        const data = [];
        for(var i=0;i<this.pageSize;i++){
          data.push(i)
        }
        if(type==0) {
          this.pageIndex = 0
          this.data = []
        }else {
          this.pageIndex++;
        }
        this.data = this.data.concat(data);
        this.$refs.list.onDataChange(this.data,false)
      }, 1000);
    }
  }
}
</script>

<style scoped>
.list {
  display: absolute;
  top:0;
  bottom: 0;
  left: 0;
  right: 0;
}
.item {
  height: 100px;
}
</style>
